<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/datasource/datasource-beta-min.js"></script>
<script type="text/javascript" src="http://yui.yahooapis.com/2.2.2/build/datatable/datatable-beta-min.js"></script>
<script type="text/javascript" src="./data.js"></script>

<div id="dynamic-datatable-simple">
	<div id="hd">
    <h1>DataTable Widget :: Basic Table</h1>
  </div>
  <div id="bd">
    <div id="basic" class="example"></div>
  </div>
  <script type="text/javascript">
		var myColumnHeaders = [
		    {key:"id", sortable:true, resizeable:true},
		    {key:"date", type:"date", sortable:true, resizeable:true},
		    {key:"quantity", type:"number", sortable:true, resizeable:true},
		    {key:"amount", type:"currency", sortable:true, resizeable:true},
		    {key:"title", type:"html", sortable:true, resizeable:true}
		];
		
		var myColumnSet = new YAHOO.widget.ColumnSet(myColumnHeaders);
		
		var myDataSource = new YAHOO.util.DataSource(YAHOO.example.Data.bookorders);
		myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
		myDataSource.responseSchema = {
		    fields: ["id","date","quantity","amount","title"]
		};
		var myDataTable = new YAHOO.widget.DataTable("basic", myColumnSet, myDataSource,{caption:"Example: Basic Table"});
  </script>
</div>